<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <title>行车数据</title>
    <script src="../commom/jquery211.min.js"></script>
    <script src="../commom/echarts.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/battery.css">
    <link rel="stylesheet" href="../css/switch.css">
    <link rel="stylesheet" href="../css/font-awesome.css">
    <link rel="stylesheet" type="text/css" href="../css/maincss.css">
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=6f6dcfd16f99199ae4f1949fcac0b8e4&plugin=AMap.Geocoder"></script>
    <script type="text/javascript" src="../js/truckloginfo.js"></script>
</head>


<body>
<div style="height: 45px; background-color: #0f88eb">
    <li class="dropdown" style="float: right;list-style-type:none; padding-top: 7px;padding-right: 7px">
        <a class="dropdown-toggle icon-user icon-2x" data-toggle="dropdown" style="color: white;text-decoration:none"></a>
        <ul class="dropdown-menu pull-right">
            <li style="border-bottom: 1px solid #e0e0e0"><a href="userinfo_admin.html">用户信息</a></li>
            <li><a href="login.html">注销</a></li>
        </ul>
    </li>
</div>

<div class="container1" style="position: absolute;top:45px;width: 99%">
    <div style="height: 10px"></div>
    <div class="row" style="height: 487px">
        <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2" style="height: 485px">
            <embed type="text/html" src="cy_catalog.html" style="width: 100%;height: 600px"/>
        </div>
        <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10" style="height: 130px">
            <div class="row" style="height: 4px">
                <h3 class="title" style="background-image:url(../img/title.png);float: left">行车数据</h3>
            </div>
            <div class="row box" id="trucklog_form">
                <div style="clear: both"></div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width: 70px">车牌号:</label>
                    <span name="trucknumber" style="font-size: 16px;width: 80px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 90px">右胎胎温:</label>
                    <span name="righttiretemp" style="font-size: 16px"></span>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width: 70px">车速:</label>
                    <span name="speed" style="font-size: 16px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 100px">车顶前部锁:</label>
                    <span name="lock1" style="font-size: 16px"></span>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width: 90px">里程:</label>
                    <span name="distance" style="font-size: 16px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 100px">车顶中部锁:</label>
                    <span name="lock2" style="font-size: 16px"></span>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width: 80px">左胎胎压:</label>
                    <span name="lefttirepressure" style="font-size: 16px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 100px">车顶后部锁:</label>
                    <span name="lock3" style="font-size: 16px"></span>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width: 90px">左胎胎温:</label>
                    <span name="lefttiretemp" style="font-size: 16px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 90px">左阀门锁:</label>
                    <span name="lock4" style="font-size: 16px"></span>
                </div>
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                    <label style="font-size: 16px;width:80px">右胎胎压:</label>
                    <span name="righttirepressure" style="font-size: 16px"></span>
                    <div style="height: 5px"></div>
                    <label style="font-size: 16px;width: 90px">右阀门锁:</label>
                    <span name="lock5" style="font-size: 16px"></span>
                </div>
            </div>
            <div class="row box" style="text-align: center">
                <div id="chart" style="height: 300px;width: 100%">
                </div>
            </div>
            <div class="row box" style="text-align: center">
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                    <label style="float: left">网关一电量</label>
                    <div class="progress">
                        <div id="bar1" class="progress-bar"></div>
                    </div>
                    <span id="per1" style="float: left;margin: 5px;width: 15%;position: relative;top:-5px">0%</span>
                    <div style="clear: both;height: 5px"></div>
                    <label style="float: left">网关四电量</label>
                    <div class="progress">
                        <div id="bar4" class="progress-bar"></div>
                    </div>
                    <span id="per4" style="float: left;margin: 5px;width: 15%;position: relative;top:-5px">0%</span>
                </div>
                <div class="col-lg-4col-md-4 col-sm-4 col-xs-4">
                    <label style="float: left">网关二电量</label>
                    <div class="progress">
                        <div id="bar2" class="progress-bar"></div>
                    </div>
                    <span id="per2" style="float: left;margin: 5px;width: 15%;position: relative;top:-5px">0%</span>
                    <div style="clear: both;height: 5px"></div>
                    <label style="float: left">网关五电量</label>
                    <div class="progress">
                        <div id="bar5" class="progress-bar"></div>
                    </div>
                    <span id="per5" style="float: left;margin: 5px;width: 15%;position: relative;top:-5px">0%</span>
                </div>
                <div class="col-lg-4col-md-4 col-sm-4 col-xs-4">
                    <label style="float: left">网关三电量</label>
                    <div class="progress">
                        <div id="bar3" class="progress-bar"></div>
                    </div>
                    <span id="per3" style="float: left;margin: 5px;width: 15%;position: relative;top:-5px">0%</span>
                </div>
            </div>
            <div class="row box" style="text-align: center">
                <p id="address" style="font-size: 16px;float: left"></p>
                <div id="map" style="width: 100%;height: 400px"></div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
